<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			div{
				/* 给父级添加flex属性 */
				
				display: flex;
				width: 800px;
				height: 400px;
				background-color: red;
				/* 默认主轴是x轴，row 。元素是沿着主轴排列的*/
				/* flex-direction: row; */
				/* flex-direction: row-reverse; */
				/* 把主轴设置为y轴*/
				/* flex-direction: column; */
				justify-content: center;
				/* justify-content: space-between; */
				/* wrap：换行 */
				flex-wrap:wrap;
			/* 	align-items: flex-start; */
				align-items: stretch;
				}
			div span{
				width:150px;
				/* height:100px; */
				background-color: blue;
				color：#fff;
				margin-right:10px;
			}	
		</style>
	</head>
	<body>
		<div>
			<span>1</span>
			<span>2</span>
			<span>3</span>

		</div>
	</body>
</html>